<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- The HTML 4.01 Transitional DOCTYPE declaration-->
<!-- above set at the top of the file will set     -->
<!-- the browser's rendering engine into           -->
<!-- "Quirks Mode". Replacing this declaration     -->
<!-- with a "Standards Mode" doctype is supported, -->
<!-- but may lead to some differences in layout.   -->

<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Hello App Engine</title>
    
    
    <script src="http://www.google.com/jsapi?key=AIzaSyACn3EhFbyzbl9AnDRFPu9m1Ldgu7ZEvbc" type="text/javascript"></script>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
  
    <script language="Javascript" type="text/javascript">
	    google.load("search", "1");
	 
	    function OnLoad() {

	    	 // Add in local search
	    	var localSearch = new google.search.LocalSearch();
	        	
	    	// Create a search control
	    	var searchControl = new google.search.SearchControl();	     	  
	    	var options = new google.search.SearcherOptions();

	    	options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
	    	//searchControl.addSearcher(localSearch);
	    	
	    	searchControl.addSearcher(localSearch, options);
	    		    	
	    	localSearch.setResultSetSize("8");  // set results page
	    			    	
	    	// Tell the searcher to draw itself and tell it where to attach
		
	    	searchControl.draw(document.getElementById("searchcontrol"));

	    	//searchControl.gotoPage(2);
	    	searchControl.setSearchCompleteCallback(this, gotResults);

	    	// Execute an inital search
			
	    	searchControl.execute("");	
	    	  	 		        
	    }

	    function gotResults(sc, searcher)
	    {
	    	var resultcontent = '';
	    		    	
	    	var resultdiv = document.getElementById('searchresults');
	    	console.log(searcher.cursor.pages);
	    	
	    	for (i=0; i<searcher.results.length; i++)
	    	{
	    		var result = searcher.results[i];
				var link = "<a href='"+result.url+"'>"+result.title+"</a>"; 
				
	    		resultcontent += '<p>'+link+'<br />'+result.streetAddress+'<br />'+result.city+','+result.region+'</p>';
	    		// resultcontent += result.ddUrlFromHere
	    	}
	    	/*
	    	for(i=0;i<searcher.cursor.pages.length;i++)
	    	{
		    	var labresult = searcher.cursor.pages[i];
	    		resultcontent += '<a onclick="set()" href="#">'+labresult.label+'</div>';
	    	}
	    	*/
	    	resultdiv.innerHTML = resultcontent;	

	    	var content = $('.gsc-cursor-box').html();     	
	    	$('#tttest').html(content);		    
	    }
	  	function set()
	  	{
	  		google.setOnLoadCallback(OnLoad,2)
	  		  
	  	}
	    google.setOnLoadCallback(OnLoad);
	    
    </script>
    
    <style>
      	.localexample
    	{
    		width: 40%;
    		height: 100%;
    		float: left;
    	}
		 .gsc-resultsRoot { display : none; }  // disable google results
		
    	.localexample strong
    	{
    		display: block;
    		border-bottom: 1px dotted #ccc;
    		margin-bottom: 20px;
    	}
    	
    	#googleversion
    	{    		
    		margin-right: 50px;
    	}
    	
    	#myversion
    	{

    	}

    </style>
    
  </head>

  <body>
    <div id="googleversion" class="localexample"> 
   		<strong>Keyword</strong>	 
	    <div id="searchcontrol" style="">Loading...</div>
	</div>
	
    <div id="myversion" class="localexample">
        <strong>Created programmatically</strong>
        <div id="searchresults"></div>
    </div>
   
  </body>
</html>
